<template>
    <div class="LW_workOnline_div">
        <div class="LW_workOnline_top" style="background: #059EDF 100%">
            <div class="LW_workOnline_top_ico_div" @click="$router.push('/lineWork')">
                <a-icon type="arrow-left" class="LW_workOnline_top_ico" theme="outlined" />
            </div>
            <div class="LW_workOnline_top_menu">上道人员</div>
        </div>
        <div class="LW_workOnline_content">
            <ul class="LW_workOnline_ul">
                <li class="LW_workOnline_li" v-if="planDetail.作业负责人!==''">【作业负责人】{{planDetail.作业负责人}}</li>
                <li class="LW_workOnline_li" v-if="planDetail.带班人!==''">【带班人】{{planDetail.带班人}}</li>
                <li class="LW_workOnline_li" v-if="planDetail.驻站防护人!==''">【驻站防护人】{{planDetail.驻站防护人}}</li>
                <li class="LW_workOnline_li" v-if="planDetail.现场防护人!==''">【现场防护人】{{planDetail.现场防护人}}</li>
                <li class="LW_workOnline_li" v-if="planDetail.远方防护人!==''">【远方防护人】{{planDetail.远方防护人}}</li>
            </ul>
            <a-row :span="24" class="LW_workOnline_row">
                <a-col class="LW_workOnline_col">
                    <a-button type="default" class="LW_workOnline_button" @click="sendStep()" >人员确认</a-button>
                </a-col>
            </a-row>
        </div>
    </div>
</template>
<style >
    .LW_workOnline_div{
        width: 100vw;
    }
    .LW_workOnline_top{
        width: 100vw;
        height: 14vw;
    }
    .LW_workOnline_top_ico_div {
        float: left;
        width: 16vw;
        height: 14vw;
        line-height: 13.75vw;
        margin: 0;
        padding: 0;
        font-size: 4vw;
        text-align: center;
    }
    .LW_workOnline_top_menu{
        width: 84vw;
        height: 14vw;
        line-height: 14vw;
        color: white;
        font-size: 6vw;
        text-align: center;
        generic-family:SourceHanSansSC-regular;
        float: left;

    }

    .LW_workOnline_top_ico{
        font-size: 7vw;
        color: white;
        margin: 3.5vw 0 0 0;

    }
    .LW_workOnline_content{
        width: 100vw;
        generic-family:Roboto;
        font-weight: normal;
        height: 154vw;
        overflow: auto;

    }
    .LW_workOnline_ul{
        width: 100vw;
        padding: 0 2vw 0 4vw;
        overflow: auto;
        font-weight: normal;
        margin: 3vw 0 0 0 ;
        generic-family:SourceHanSansSC-regular;


    }
    .LW_workOnline_li{
        width: 94vw;
        height: inherit;
        list-style: none;
        font-size: 5.5vw;
        color: black;
        text-align: left;
        padding: 0;
        word-break: break-all;
        white-space: pre-wrap;
        margin-bottom: 10px;
        line-height: 1.2;

    }
    .LW_workOnline_row{
    }
    .LW_workOnline_col{
        text-align: center;
    }
    .LW_workOnline_button{
        font-size: 5vw;
        color: black;
        width: 60vw;
        height: 12vw;
        border-radius: 2vw;
        generic-family: PingFangSC-Semibold;
    }
</style>
<script>
    import ACol from "ant-design-vue/es/grid/Col";
    import ARow from "ant-design-vue/es/grid/Row";
    export default {
        name: "LineWorkSurePerson",
        components: {ARow, ACol},
        mounted() {
            this.getInfoById();
        },
        data() {
            return {
                myStep: '2',
                name:'确认人员',
                id:'',
                planDetail:'',
            }
        },
        methods:{
            sendStep(){
                let that = this;
                let methodName = "开始";
                let note = '';
                let currStepInfo={};
                that.$api.step(that.id,that.name,methodName,note).then((resp)=>{
                    if(resp.status === 200){
                        console.log("计划开始成功");
                        //将当前step的路由信息保存进内存，方便拍照跳过时的回退，避免丢失路由参数
                        currStepInfo.step = that.myStep;
                        currStepInfo.id = that.id;
                        currStepInfo.name = that.name;
                        localStorage.setItem("currStepInfo",JSON.stringify(currStepInfo));

                        that.$router.push({name: 'lineWorkTakePhoto',params: {step: that.myStep,id:that.id,name:that.name}});

                    }
                }).catch((error)=>{
                    alert("计划开始失败");
                    console.log(error);
                })

            },
            getInfoById(){
                let that = this;
                that.id =that.$route.params.id?that.$route.params.id:JSON.parse(localStorage.getItem("currStepInfo")).id;
                that.$api.getPlanById(that.id).then(function(resp){
                    //状态码200
                    if(resp.status === 200){
                        //let otherFailSendInfo = failSendInfo.filter(item=>item.UserId!==UserId);//其余的失败信息集合*/
                        that.planDetail = resp.data.result.planDetail;//已完成
                    }
                }).catch(function(error){
                    //请求失败
                    console.log("init person failed:"+error);

                })
            },

        },
    }
</script>

